
<%-- 
    Document   : indicador
    Created on : 16/04/2010, 03:05:56 PM
    Author     : LYLA
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="http://struts.apache.org/tags-bean"  prefix="bean"%>
<%@taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@taglib uri="/tags/c" prefix="c"%>
<%@ include file="seguridad.jsp" %>

<script src="scripts/ajax.js" language="JavaScript"></script>


<html>
    <script LANGUAGE="JavaScript">
           function regresar(){
            var form = document.getElementById("PEIForm");
            var idob = document.getElementById("idObj").value;
            var descObj = document.getElementById("descObj").value;


            form.action="PEI.do?dispatch=listarMetaO&idob="+idob+"&descObj="+descObj+"&descMetaO=";
            form.method="post";
            form.submit();
        }

        function contar(texto,e){

            document.getElementById("contador").value=document.getElementById("descIndO").value.length;

            if (texto.length > 500 ) {
                if (navigator.appName == "Netscape") tecla = e.which
                else tecla = e.keyCode
                if (tecla != 8) return false
            }
            return true

        }

        function mVerificacion(codigo,idIndO,desc){
           
            var codMetaO = document.getElementById("codMetaO").value;
            
            var form = document.getElementById("PEIForm");
            var idObj= document.getElementById("idObj").value;
            var idMetaO= document.getElementById("idMetaO").value;
            form.action="PEI.do?dispatch=listarMedVerificacion&codIndO="+codigo+"&descIndO="+desc+"&codMetaO="+codMetaO+"&idObj="+idObj+"&idMetaO="+idMetaO+"&idIndO="+idIndO;
            form.method="post";
            form.submit();
        }

        function editarT(cod,idindo,desc){
            var form = document.getElementById("PEIForm");
            document.getElementById("opcionIndO").value=2;
            document.getElementById("codIndO").value=cod;
            document.getElementById("idIndO").value=idindo;
            form.descIndO.value = desc;
            document.getElementById("contador").value=desc.length;
        }

        function eliminar(codigo){
               if (confirmAction()==false) return;
            var desc = document.getElementById("descIndO").value;
            var codMeta = document.getElementById("codMetaO").value;
            var idIndO = document.getElementById("idIndO").value;
            var idDiv = "divTabla";
            var metodo = "GET";
            var op = 3;
            var url = "consultasAjax/listarIndicadorAjax.jsp?desc="+desc+"&codMeta="+codMeta+"&codIndO="+codigo+"&metodo="+op+"&idIndO="+idIndO;
            var cadenaSalida = "";
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
        }



          function confirmAction(){
        if (confirm("Se borrara El Indicador ,Medio de Verificacion   y componentes del registro seleccionado  \n ¿Esta seguro de continuar? "))
            return true;
        else return false;
     }
        function confirmActionGuardar(){
              if (confirm("Se Guardara los cambios hechos en la pantalla  \n ¿Esta seguro de continuar? "))
                return true;
            else
                return false;
        }


        function insertar(){

           if (confirmActionGuardar()==false) return;

        	if(document.getElementById("descIndO").value==""){
        		alert("Ingrese descripcion");
            	document.getElementById("descIndO").focus();
            	return
            }
            
            var op=document.getElementById("opcionIndO").value;
            var codMeta = document.getElementById("codMetaO").value;
            var codIndO = document.getElementById("codIndO").value;
            var desc = document.getElementById("descIndO").value;
            var idIndO = document.getElementById("idIndO").value;


            var idDiv = "divTabla";
            var metodo = "GET";
            var url = "consultasAjax/listarIndicadorAjax.jsp?desc="+desc+"&codMeta="+codMeta+"&codIndO="+codIndO+"&metodo="+op+"&idIndO="+idIndO;
            var cadenaSalida = "";
            
            var async = true;
            document.getElementById(idDiv).innerHTML;
            autoCompletarDiv(metodo,url,cadenaSalida,async,idDiv);
            document.getElementById("opcionIndO").value=1;
            document.getElementById("descIndO").value="";
            document.getElementById("contador").value="0";
             
        }
   function validar(){


             if (document.getElementById("descIndO").value==""){
                alert("Ingrese la Descripci&oAcute;n del Indicador");
                document.getElementById("descIndO").focus();
                return;
            }
            insertar();
}
        function autoCompletarDiv(metodo,url,cadena,async,idDiv)
        {
            if( window.XMLHttpRequest )
                ajax = new XMLHttpRequest(); // No Internet Explorer
            else
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            ELEMENT_DIV = idDiv;
            ajax.onreadystatechange = funcionCallbackVerDiv;
            ajax.open( metodo, url, async);
            ajax.send(cadena);
        }

        function funcionCallbackVerDiv()
        {
            if( ajax.readyState == 4 )
            {
                if( ajax.status == 200 )
                { //alert(ajax.responseText);
                    document.getElementById(ELEMENT_DIV).innerHTML = ajax.responseText;
                }
            }
        }

        function posicioninicial(){
            document.getElementById("descIndO").focus();
        }

    </script>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link type="text/css" rel="stylesheet" href="lib/css/Style_Font_Text.css" >
        <link type="text/css" rel="stylesheet" href="lib/css/Style_PageTable.css" >
        <link type="text/css" rel="stylesheet" href="lib/css/Style_Index.css" >
        <title>JSP Page</title>
    </head>
    <body>
        <center>
            <h1 class="substylo">Indicador de Meta</h1>
        </center>
        <div style="overflow: auto; width: 710px; height: 400px">
                       
                        <html:form action="PEI.do?dispatch=ingresarMObjetivo" styleId="PEIForm">
                            <html:hidden property="opcionIndO" styleId="opcionIndO" value="1"/>
                           
                    <table>
                    <tr>
                                    <td align="left" class="tdLeft">
                                        N&uacute;mero Objetivo
                                        General Estrat&eacute;gico :
                                    </td>
                                    <td align="left">
                                        <html:text  styleId="idObj" property="idObj" maxlength="5" styleClass="text" disabled="true"/>
                                    </td>
                    </tr>
                    <tr>
                                    <td style="width: 150px">
                                        Objetivo General:
                                    </td>
                                    <td style="width: 400px">
                                        <html:textarea  styleId="descObj" property="descObj"  disabled="true" rows="5" cols="50" styleClass="textarea"/>
                                    </td>
                    </tr>
                    <tr>
                                    <td align="left" class="tdLeft">
                                        N&uacute;mero Meta :
                                    </td>
                                    <td align="left">
                                        <html:text  styleId="idMetaO" property="idMetaO" maxlength="5" styleClass="text" disabled="true"/>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="width: 150px">Meta</td>
                                    <td style="width: 400px"><html:textarea  styleId="descMetaO" property="descMetaO"  disabled="true" rows="5" cols="50" styleClass="textarea"/></td>
                    </tr>
                  
                    <tr>
                                    <td style="width: 150px">
                                        Tipo de Medici&oacute;n de Meta </td>
                                    <td style="width: 400px">
                                        <html:text  styleId="tipoMetaO" property="tipoMetaO" maxlength="400" disabled="true" styleClass="text"/>
                                    </td>
                    </tr>
                    </table>
                    <p></p>
                    
                   
                        <table>

                            <tr>
                                    <td align="left" class="tdLeft">
                                        N&uacute;mero Indicador :
                                    </td>
                                    <td align="left">
                                        <html:text  styleId="idIndO" property="idIndO" maxlength="5" styleClass="text"/>
                                    </td>
                            </tr>




                            <tr>
                                    <td style="width: 150px">Ingresar Descripci&oacute;n del Indicador</td>
                                     <td style="width: 400px"><html:textarea  styleId="descIndO" property="descIndO" rows="5" cols="50" onkeydown="return contar(this.value,event)" onkeyup="return contar(this.value,event)" styleClass="textarea" />
                                    <input type="text" size="2" id="contador" /><label style="color: #990033" >M&aacute;ximo 500 caracteres</label>
                                </td>
                            </tr>
                            <td><p></p></td>
                            <tr>
                                    <td colspan="2" align="center"><input type="button" value="Grabar" onclick="validar()" class="submit2"/></td>
                            </tr>
                        </table>
                            <%int i=1;%>
                 
                            <br><br>
                    <logic:present name="PEIForm" property="listaIndO">
                                <div id="divTabla" style="width:100%">
                            <table id="tabla1" width="99%" align="right" class="userTable">
                                <tr class="even" align="center">
                                    <th class="textoTR">#</th>
                                    <th class="textoTR">Indicador</th>
                                    <th class="textoTR">Editar</th>
                                    <th class="textoTR">Eliminar</th>
                                    <th class="textoTR">Medio de Verificaci&oacute;n</th>
                                </tr>
                                <logic:iterate name="PEIForm" property="listaIndO" id="lista">
                                    <tr align="center">
                                        <td width="10%" align="center">
                                           <bean:write name="lista" property="NUM_IDOBJ"/>.<bean:write name="lista" property="NUM_IDMOBJ"/>.<bean:write name="lista" property="NUM_IDINDO"/>.
                                        </td>

                                        <td style="width:1500px;text-align: left" align="center">
                                            <bean:write name="lista" property="TX_DESCINDO"/>
                                        </td>

                                        <td width="10%" align="center">
                                            <img style="cursor:pointer" title="Editar" alt="Editar" border=0  src="images/b_edit.png" onclick="editarT('<c:out value="${lista.NUM_CODINDO_PK}"/>','<c:out value="${lista.NUM_IDINDO}"/>','<c:out value="${lista.TX_DESCINDO}"/>');posicioninicial();"/>
                                        </td>

                                        <td width="10%" align="center">
                                            <img style="cursor:pointer" title="Eliminar" alt="Eliminar" border=0  src="images/b_drop.png" onclick="eliminar('<c:out value="${lista.NUM_CODINDO_PK}"/>');"/>
                                        </td>

                                        <td width="20%" align="center">
                                            <img style="cursor:pointer" title="Medio de Verificacion" alt="Medio de Verificacion" border=0  src="images/file_preview.png" onclick="mVerificacion('<c:out value="${lista.NUM_CODINDO_PK}"/>','<c:out value="${lista.NUM_IDINDO}"/>','<c:out value="${lista.TX_DESCINDO}"/>');"/>
                                        </td>
                                    </tr>
                                </logic:iterate>
                            </table>
                        </div>
                    </logic:present>
                    <html:hidden property="codIndO" styleId="codIndO"/>
                    <html:hidden property="codObj" styleId="codObj"/>
                    <html:hidden property="codMetaO" styleId="codMetaO"/>
                    <html:hidden property="descMetaO" styleId="descMetaO"/>
                    <html:hidden property="descObj" styleId="descObj"/>
                    <html:hidden property="tipoMetaO" styleId="tipoMetaO"/>
                </html:form>
                            <br>
<html:button property="button"  value="regresar" onclick="regresar()" styleClass="submit2"/>
        </div>
    </body>
</html>